// 租赁信息
<template>
  <div>
    <div class="padding-bottom-10 flex justify-between">
      <span class="font-weight-700 font-size-18">{{ title }}</span>
      <span v-if="contractType != 'ZL'">最新变更：{{ changeEffectiveTime | formatDateTime('YYYY-MM-DD') }}</span>
    </div>
    <el-table :border="false" :data="tableList" class="new-table-style">
      <el-table-column align="left" label="资产名称" v-if="contractType != 'QTSR' && contractType != 'WRSB'">
        <template slot-scope="scope">
          <span v-html="scope.row.assetDesc || scope.row.assetName"></span>
        </template>
      </el-table-column>
      <el-table-column v-if="contractType == 'QTSR' || contractType == 'WRSB'" align="left" label="经营事项说明" prop="remark"></el-table-column>

      <el-table-column v-if="contractType == 'QTSR'" align="center" label="收入类型" prop="assetName"> </el-table-column>
      <el-table-column v-if="contractType == 'WRSB'" align="center" label="无人设备" prop="assetName"> </el-table-column>

      <el-table-column v-if="contractType == 'ZL'" align="center" label="资产面积" width="120">
        <template slot-scope="scope">
          <span>{{ scope.row.chargeArea }}<i class="font-size-12">&nbsp;m²</i></span>
        </template>
      </el-table-column>

      <el-table-column v-if="contractType == 'ZL'"  align="center" :label="typeTxt" prop="assetTypeName" width="120"> </el-table-column>

<!--      <el-table-column v-if="contractType == 'LSCD'" align="center" label="租赁事项" prop="remark"> </el-table-column>-->

<!--      <el-table-column v-if="contractType == 'ZL'" align="center" label="交付时间" width="120">-->
<!--        <template slot-scope="scope">-->
<!--          <span>{{ scope.row.deliveryDate | formatDateTime('YYYY-MM-DD') }}</span>-->
<!--        </template>-->
<!--      </el-table-column>-->
      <el-table-column align="center" :label="startDateTxt" min-width="120">
        <template slot-scope="scope">
          <span>{{ scope.row.rentStartDate | formatDateTime('YYYY-MM-DD') }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" :label="endDateTxt" min-width="120">
        <template slot-scope="scope">
          <span>{{ scope.row.rentEndDate | formatDateTime('YYYY-MM-DD') }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="付款方式" prop="paymentMethodName" min-width="120"> </el-table-column>
      <el-table-column align="center" label="预计总收入(元)" min-width="160">
        <template slot-scope="scope">
          <span>{{ scope.row.totalIncomeAmount | moneyFilterNoUnit }}</span>
        </template>
      </el-table-column>
      <!-- 租赁合同 ｜ 代运营合同 -->
      <template v-if="contractType == 'ZL' || contractType == 'TCCYY'">
        <el-table-column align="center" label="折合租金单价" min-width="120">
          <template slot-scope="scope">
            <span>{{ scope.row.rentalUnitPrice | moneyFilterNoUnit }}<i class="font-size-12">&nbsp;元/天/m²</i></span>
          </template>
        </el-table-column>
      </template>
      <!-- <el-table-column label="操作" align="center">
        <template slot-scope="scope">
          <el-button type="text" @click="goInfo(scope.row)">查看账单</el-button>
        </template>
      </el-table-column> -->
    </el-table>
  </div>
</template>

<script>
  export default {
    props: {
      tableList: {
        type: Array,
        default: () => {
          return [];
        },
      },
      title: {
        type: String,
        default: '',
      },
      leaseDate: {
        type: Number,
        default: 0,
      },
      changeEffectiveTime: {
        type: Number,
        default: 0,
      },
    },

    data() {
      return {
        contractType: this.$route.query.contractType,
        typeTxt: '租赁类型',
        startDateTxt: '起租时间',
        endDateTxt: '退租时间',
      };
    },

    mounted() {
      this.initTxt();
    },

    methods: {
      initTxt() {
        if (this.contractType == 'ZL') {
          this.typeTxt = '租赁类型';
        } else if (this.contractType == 'TCCYY') {
          this.typeTxt = '租赁类型';
          this.startDateTxt = '代运营开始时间';
          this.endDateTxt = '代运营结束时间';
        } else if (this.contractType == 'QTSR') {
          this.startDateTxt = '收费开始时间';
          this.endDateTxt = '收费结束时间';
        }
      },

      goInfo(row) {
        let params = this.$route.query;
        params.assetCode = row.assetCode;
        let pathUrl = {
          name: 'contract-bill',
          query: params,
        };
        let { href } = this.$router.resolve(pathUrl);
        window.location.href = href;
      },
    },
  };
</script>

<style lang="scss" scoped></style>
